<template>
  <div >
    <el-menu
      :default-active="activeIndex2"
      class="el-menu-demo"
      mode="horizontal"
      @select="handleSelect"
      background-color=#4682B4
      text-color="#fff"
      active-text-color="#ffd04b">
      <el-menu-item index="1" @click="$router.push('/home')">首页</el-menu-item>
      <el-menu-item index="3" @click="$router.push('/DatabaseHome')">数据库</el-menu-item>

      <el-submenu index="2">
        <template slot="title">数据导入导出</template>
        <el-menu-item index="2-1" @click="$router.push('/DataImport')">导入数据</el-menu-item>
        <el-menu-item index="2-2" @click="$router.push('/DataExport')">导出数据</el-menu-item>
      </el-submenu>
    </el-menu>
    <el-button type="success" @click="outTab();outTab0();outTab1();outTab2();outTab3();outTab4()">导出数据</el-button>
    <el-button slot="trigger" @click="goBack()" type="primary">返回</el-button>
    <el-table
      v-show="false"
      id="out-table"
      v-loading="loading"
      :data="tableDataBsxxb"
      stripe
      border
    >
      <el-table-column
        prop="baseinfoWzbm"
        label="baseinfoWzbm"
        width="180">
      </el-table-column>
      <el-table-column
        prop="baseinfoType"
        label="baseinfoType"
        width="180">
      </el-table-column>
      <el-table-column
        prop="baseinfoKind"
        label="baseinfoKind"
        width="180">
      </el-table-column>
      <el-table-column
        prop="baseinfoZwmc"
        label="baseinfoZwmc">
      </el-table-column>
      <el-table-column
        prop="baseinfoZwqtmc"
        label="baseinfoZwqtmc"
        width="180">
      </el-table-column>
      <el-table-column
        prop="baseinfoYwmc"
        label="baseinfoYwmc"
        width="180">
      </el-table-column>
      <el-table-column
        prop="baseinfoYwqtmc"
        label="baseinfoYwqtmc">
      </el-table-column>
      <el-table-column
        prop="baseinfoIupac"
        label="baseinfoIupac">
      </el-table-column>
      <el-table-column
        prop="baseinfoCas"
        label="baseinfoCas"
        width="180">
      </el-table-column>
      <el-table-column
        prop="baseinfoCasElse"
        label="baseinfoCasElse"
        width="180">
      </el-table-column>
      <el-table-column
        prop="baseinfoCi"
        label="baseinfoCi">
      </el-table-column>
      <el-table-column
        prop="baseinfoSmiles"
        label="baseinfoSmiles">
      </el-table-column>
      <el-table-column
        prop="baseinfoFzs"
        label="baseinfoFzs">
      </el-table-column>
      <el-table-column
        prop="baseinfo_xdfzzl"
        label="baseinfo_xdfzzl">
      </el-table-column>
      <el-table-column
        prop="baseinfo_jgs"
        label="baseinfo_jgs">
      </el-table-column>
    </el-table>
    <el-table
      id="out-table0"
      v-show="false"

      v-loading="loading"
      :data="tableDataLhsxb"
      stripe
      border
      >
    <el-table-column
      prop="baseinfoWzbm"
      label="baseinfoWzbm"
      width="180">
    </el-table-column>
    <el-table-column
      prop="attribute"
      label="attribute"
      width="180">
    </el-table-column>
    <el-table-column
      prop="unit"
      label="unit">
    </el-table-column>
      <el-table-column
        prop="value"
        label="value"
        width="180">
      </el-table-column>
      <el-table-column
        prop="temperature"
        label="temperature"
        width="180">
      </el-table-column>
      <el-table-column
        prop="pa"
        label="pa">
      </el-table-column>
      <el-table-column
        prop="shiceyuce"
        label="shiceyuce"
        width="180">
      </el-table-column>
      <el-table-column
        prop="source"
        label="source"
        width="180">
      </el-table-column>
      <el-table-column
        prop="remark"
        label="remark">
      </el-table-column>
      </el-table>

    <el-table
      id="out-table1"
      v-show="false"

      :data="tableDataHjxwb"
      v-loading="loading"
      stripe
      border
      style="margin-top: 80px;">
      <el-table-column
        prop="baseinfoWzbm"
        label="baseinfoWzbm"
        width="180">
      </el-table-column>
      <el-table-column
        prop="attribute"
        label="attribute"
        width="180">
      </el-table-column>
      <el-table-column
        prop="unit"
        label="unit">
      </el-table-column>
      <el-table-column
        prop="value"
        label="value"
        width="180">
      </el-table-column>
      <el-table-column
        prop="destination"
        label="destination"
        width="180">
      </el-table-column>
      <el-table-column
        prop="time"
        label="time">
      </el-table-column>
      <el-table-column
        prop="method"
        label="method"
        width="180">
      </el-table-column>
      <el-table-column
        prop="shiceyuce"
        label="shiceyuce"
        width="180">
      </el-table-column>
      <el-table-column
        prop="source"
        label="source"
        width="180">
      </el-table-column>
      <el-table-column
        prop="remark"
        label="remark">
      </el-table-column>
    </el-table>
    <el-table
      id="out-table2"
      v-show="false"

      v-loading="loading"
      :data="tableDataStwhb"
      stripe
      border
      style="margin-top: 80px;">
      <el-table-column
        prop="baseinfoWzbm"
        label="baseinfoWzbm"
        width="180">
      </el-table-column>
      <el-table-column
        prop="attribute"
        label="attribute"
        width="180">
      </el-table-column>
      <el-table-column
        prop="unit"
        label="unit">
      </el-table-column>
      <el-table-column
        prop="value"
        label="value"
        width="180">
      </el-table-column>
      <el-table-column
        prop="type"
        label="type"
        width="180">
      </el-table-column>
      <el-table-column
        prop="time"
        label="time">
      </el-table-column>
      <el-table-column
        prop="method"
        label="method"
        width="180">
      </el-table-column>
      <el-table-column
        prop="shiceyuce"
        label="shiceyuce"
        width="180">
      </el-table-column>
      <el-table-column
        prop="source"
        label="source"
        width="180">
      </el-table-column>
      <el-table-column
        prop="remark"
        label="remark">
      </el-table-column>
    </el-table>

    <el-table
      id="out-table3"
      v-loading="loading"
      v-show="false"

      :data="tableDataJkwhb"
      stripe
      border
      style="margin-top: 80px;">
      <el-table-column
        prop="baseinfoWzbm"
        label="baseinfoWzbm"
        width="180">
      </el-table-column>
      <el-table-column
        prop="attribute"
        label="attribute"
        width="180">
      </el-table-column>
      <el-table-column
        prop="species"
        label="species">
      </el-table-column>
      <el-table-column
        prop="zax"
        label="zax"
        width="180">
      </el-table-column>
      <el-table-column
        prop="shiceyuce"
        label="shiceyuce"
        width="180">
      </el-table-column>
      <el-table-column
      prop="unit"
      label="unit"
      width="180">
    </el-table-column>
      <el-table-column
      prop="value"
      label="value"
      width="180">
    </el-table-column>
      <el-table-column
        prop="time"
        label="time">
      </el-table-column>
      <el-table-column
      prop="type"
      label="type"
      width="180">
    </el-table-column>
      <el-table-column
        prop="source"
        label="source"
        width="180">
      </el-table-column>
      <el-table-column
        prop="method"
        label="method"
        width="180">
      </el-table-column>
      <el-table-column
        prop="remark"
        label="remark">
      </el-table-column>
    </el-table>

    <el-table
      id="out-table4"
      v-loading="loading"
      :data="tableDataHyxxb"
      stripe
      border
      style="margin-top: 80px;">
      <el-table-column
        prop="baseinfoWzbm"
        label="baseinfoWzbm"
        width="180">
      </el-table-column>
      <el-table-column
        prop="attribute"
        label="attribute"
        width="180">
      </el-table-column>
      <el-table-column
        prop="unit"
        label="unit">
      </el-table-column>
      <el-table-column
        prop="value"
        label="value"
        width="180">
      </el-table-column>
      <el-table-column
        prop="time"
        label="time">
      </el-table-column>
      <el-table-column
        prop="source"
        label="source"
        width="180">
      </el-table-column>
      <el-table-column
        prop="remark"
        label="remark">
      </el-table-column>
    </el-table>
  </div>

</template>

<script>
import XLSX from 'xlsx'
import FileSaver from 'file-saver'
export default {
  data() {
    return {
      //从后台请求的数据
      tableDataBsxxb: [{
        baseinfoWzbm: '',
        baseinfoType: '',
        baseinfoKind: '',
        baseinfoZwmc: '',
        baseinfoZwqtmc: '',
        baseinfoYwmc: '',
        baseinfoYwqtmc: '',
        baseinfoIupac: '',
        baseinfoCas: '',
        baseinfoCasElse: '',
        baseinfoCi: '',
        baseinfoSmiles: '',
        baseinfoFzs: '',
        baseinfo_xdfzzl: '',
        baseinfo_jgs: ''
      }],
      tableDataLhsxb: [{
        baseinfoWzbm: '',
        attribute: '',
        unit: '',
        value: '',
        temperature: '',
        pa: '',
        shiceyuce: '',
        source: '',
        remark: ''
      }],
      tableDataHjxwb: [{
        baseinfoWzbm: '',
        attribute: '',
        medium: '',
        unit: '',
        value: '',
        destination: '',
        time: '',
        method: '',
        shiceyuce: '',
        source: '',
        remark: ''
      }],
      tableDataStwhb: [{
        baseinfoWzbm: '',
        attribute: '',
        species: '',
        unit: '',
        value: '',
        type: '',
        time: '',
        method: '',
        shiceyuce: '',
        source: '',
        remark: ''
      }],
      tableDataJkwhb: [{
        baseinfoWzbm: '',
        attribute: '',
        species: '',
        zax: '',
        shiceyuce: '',
        unit: '',
        value: '',
        time: '',
        type: '',
        source: '',
        method: '',
        remark: ''
      }],
      tableDataHyxxb: [{
        baseinfoWzbm: '',
        attribute: '',
        unit: '',
        value: '',
        time: '',
        source: '',
        remark: ''
      }],
      loading: false
    }
  },
  created() {
    this.exportData()
  },
  methods: {
    exportData() {
      this.$api.exportexcel.findAllInElement().then((res) => {
        this.tableDataBsxxb = res.data
        for (var i = 0; i < res.data.length; i++) {
          if (res.data[i].baseinfoCasElse !== null){
            for (var t = 0; t < res.data[i].baseinfoCasElse.length; t++){
            this.tableDataBsxxb[i].baseinfoCasElse[t] = res.data[i].baseinfoCasElse[t].toString() + ','
            console.log('baseinfoCasElse', this.tableDataBsxxb[i].baseinfoCasElse)
            }

          }
          // console.log('baseinfoCasElse', res.data[i].baseinfoCasElse.toString())
        }
        // console.log(res.data)
      })

      this.$api.exportexcel.findAllInLhsxb().then((res) => {
        this.tableDataLhsxb = res.data
      })
      this.$api.exportexcel.findAllInHjxwb().then((res) => {
        this.tableDataHjxwb = res.data
      })
      this.$api.exportexcel.findAllInStwhb().then((res) => {
        this.tableDataStwhb = res.data
      })
      this.$api.exportexcel.findAllInJkwhb().then((res) => {
        this.tableDataJkwhb = res.data
      })
      this.$api.exportexcel.findAllInHyxxb().then((res) => {
        this.tableDataHyxxb = res.data
      })
    },
    outTab () {
      /* generate workbook object from table */
      let wb = XLSX.utils.table_to_book(document.querySelector('#out-table'))
      /* get binary string as output */
      let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
      try {
        FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), '标识信息表.xlsx')
      } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) }
      return wbout
    },
    outTab0 () {
      /* generate workbook object from table */
      let wb = XLSX.utils.table_to_book(document.querySelector('#out-table0'))
      /* get binary string as output */
      let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
      try {
        FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), '理化属性表.xlsx')
      } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) }
      return wbout
    },
    outTab1 () {
      /* generate workbook object from table */
      let wb1 = XLSX.utils.table_to_book(document.querySelector('#out-table1'))
      /* get binary string as output */
      let wbout1 = XLSX.write(wb1, { bookType: 'xlsx', bookSST: true, type: 'array' })
      try {
        FileSaver.saveAs(new Blob([wbout1], { type: 'application/octet-stream' }), '环境行为表.xlsx')
      } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout1) }
      return wbout1
    },
    outTab2 () {
      /* generate workbook object from table */
      let wb2 = XLSX.utils.table_to_book(document.querySelector('#out-table2'))
      /* get binary string as output */
      let wbout2 = XLSX.write(wb2, { bookType: 'xlsx', bookSST: true, type: 'array' })
      try {
        FileSaver.saveAs(new Blob([wbout2], { type: 'application/octet-stream' }), '生态危害表.xlsx')
      } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout2) }
      return wbout2
    },
    outTab3 () {
      /* generate workbook object from table */
      let wb3 = XLSX.utils.table_to_book(document.querySelector('#out-table3'))
      /* get binary string as output */
      let wbout3 = XLSX.write(wb3, { bookType: 'xlsx', bookSST: true, type: 'array' })
      try {
        FileSaver.saveAs(new Blob([wbout3], { type: 'application/octet-stream' }), '健康危害表.xlsx')
      } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout3) }
      return wbout3
    },
    outTab4 () {
      /* generate workbook object from table */
      let wb4 = XLSX.utils.table_to_book(document.querySelector('#out-table4'))
      /* get binary string as output */
      let wbout4 = XLSX.write(wb4, { bookType: 'xlsx', bookSST: true, type: 'array' })
      try {
        FileSaver.saveAs(new Blob([wbout4], { type: 'application/octet-stream' }), '行业信息表.xlsx')
      } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout4) }
      return wbout4
    },
    goBack() {
      //点击返回按钮，向后跳转
      this.$router.go(-1)
      console.log(this)
    }
  }
}
</script>
<style scoped>

</style>
